<template>
  <div>
    <div>Home</div>
    <!-- 加载当前路由的下一级路由组件 -->
    <router-view />
  </div>
</template>

<script lang="ts">
export default {
  name: "Home",
};
</script>

<script lang="ts" setup>
import { onMounted, onBeforeUnmount, onActivated, onDeactivated } from "vue";
import { useRoute } from "vue-router";

const route = useRoute();

console.log(route.query);

onMounted(() => {
  console.log("Home onMounted");
});
onBeforeUnmount(() => {
  console.log("Home onBeforeUnmount");
});
onActivated(() => {
  console.log("Home onActivated");
});
onDeactivated(() => {
  console.log("Home onDeactivated");
});
</script>

<style scoped></style>
